<template>
    <div class="dialog-view">
        <div v-if="loading" class="dialog-loading">
            <a-spin tip="Loading..." />
        </div>
        <component
            v-if="!localUrl && show"
            ref="current"
            :is="currentView"
            :menuId="menu.id"
            :menuParams="menu.params"
            :destroy="destroy"
            :layerid="layerid"
        ></component>
        <div class="dialog-iframe" v-else-if="localUrl && show">
            <iframe  style="height:100%;width:100%;border: none;" ref="iframeId" :src="localUrl" />
        </div>
    </div>
</template>

<script>
    import {Util,TokenUtil} from "@lowcode/jpaas-common-lib";
    export default {
        name: "DialogView",
        props:["currentView","url","menu","layerid","destroy","dialogBox"],
        inject:["broadCastChannel"],
        data(){
            return {
                show:true,
                localUrl:"",
                loading:false,
                closeDialog:true,

            }
        },
        created(){
            this.initView();
            //接收消息处理刷新待办.
            let self = this;
            if(self.url.includes('customform')){
                self.closeDialog = false
            }
            this.broadCastChannel.onmessage = (event) => {
                if(event.data.type==='closeDialog'){
                    Util.closeWindow(self,"ok");
                }
                if(event.data.type==='openCustomView'){
                    Util.closeWindow(self,"ok",event.data.params);
                }
                if(event.data.type==='dialogBoxDialog' && self.dialogBox){
                    Util.closeWindow(self,"ok",self.$refs['iframeId']);
                }
            };
        },
        methods:{
            /**
             * 获取iframe的数据并关闭窗口
             *
             * */
            GetIframeData(action,data){

            },
            iframeLoading(){
                this.$nextTick(()=>{
                    let iframe = this.$refs['iframeId']
                    if(iframe){
                        iframe.addEventListener('load', ()=>{
                            this.loading = false ;
                        })
                    }
                })
            },
            initView() {
                this.loading = true
                this.show=true;
                this.localUrl=this.url;
                if (this.localUrl) {
                    this.iframeLoading()
                    let token = TokenUtil.getToken();
                    if (token) {
                        if(!Util.getKey('loginUser')) {
                            Util.setKeyVal('TOKEN', token);
                            Util.setKeyVal('TOKEN_EXPIRE', token);
                        }
                    }
                    if (this.localUrl.indexOf("?") == -1) {
                        this.localUrl += "?authorization=" + token;
                    } else {
                        this.localUrl += "&authorization=" + token;
                    }
                }else {
                    this.loading = false
                }
            }
        },
        watch: {
            '$route': {
                handler: function (val, old) {
                    this.show = false;
                    this.$nextTick(() => {
                        this.initView();
                    })
                }
            },
            deep: true
        }
    }
</script>

<style scoped>
.dialog-view{
    width:100%;height:100%;position: relative
}
.dialog-loading{
    position: absolute;
    inset: 0;
    display: flex;
    justify-content: center;
    align-items: center;
}
.dialog-iframe{
    width:100%;height:100%;overflow: hidden;
    padding: 0 10px;
}
</style>
